<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <style>
        body {
            width: 350px;
            font-size: 15px;
            color: #333;
            line-height: 1.8;
            margin: 0;
            padding: 10px;
        }

        a {
            text-decoration: none;
            color: #333;
        }

        a:hover {
            color: #1a73e8;
        }

        .title {
            font-weight: bold;
            border-bottom: 1px solid #ddd;
            padding: 0 0 5px;
            font-size: 16px;
        }

        .title a {
            float: right;
            background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Cpath d='M512 42.667a464.64 464.64 0 0 0-469.333 459.52 460.373 460.373 0 0 0 320.853 436.48c23.467 4.266 32-9.814 32-22.187V838.4c-130.56 27.733-158.293-61.44-158.293-61.44a122.027 122.027 0 0 0-52.054-67.413c-42.666-28.16 3.414-27.734 3.414-27.734a98.56 98.56 0 0 1 71.68 47.36A101.12 101.12 0 0 0 396.8 767.147a99.413 99.413 0 0 1 29.867-61.44c-104.107-11.52-213.334-50.774-213.334-226.987a177.067 177.067 0 0 1 47.36-124.16 161.28 161.28 0 0 1 4.694-121.173s39.68-12.374 128 46.933a455.68 455.68 0 0 1 234.666 0c89.6-59.307 128-46.933 128-46.933a161.28 161.28 0 0 1 4.694 121.173 177.067 177.067 0 0 1 49.92 123.307c0 176.64-110.08 215.466-213.334 226.986a106.667 106.667 0 0 1 32 85.334v125.866c0 14.934 8.534 26.88 32 22.187a460.8 460.8 0 0 0 320-436.053A464.64 464.64 0 0 0 512 42.667'/%3E%3C/svg%3E") 0 3px no-repeat;
            text-indent: 23px;
        }

        .content {
            padding: 5px 0 0;
            color: #303133;
        }

        .content .info {
            color: #67c23a;
        }

        .content i {
            font-style: normal;
            color: #e6a23c;
        }

        .content u {
            text-decoration: none;
            padding: 2px 4px;
            background: #f6f6f6;
            color: #409eff;
            border-radius: 5px;
        }

        .content u.shortcut {
            letter-spacing: 1px;
        }
    </style>
</head>
<body>
<div class="title"><a href="https://gitee.com/withoutRock/dream-downloader" target="_blank">梦想网页资源下载器</a>使用说明</div>
<div class="content">
    <span class="info">此扩展程序在开发者工具运行。</span><br>
    1、打开 <i>"开发者工具"</i>，快捷键 <u title="Windows 操作系统">F12</u> 或 <u title="Mac 操作系统" class="shortcut">⌥⌘I</u>；<br>
    2、点击 <i>"资源下载器"</i> 选项卡；<br>
    3、点击 <i>"重新加载"</i> 网页进行数据抓包；<br>
    4、点击 <i>"下载资源"</i> 保存全部网页资源；
</div>
</body>
</html>
